import React from 'react';
import Son from './son';
import { NavLink, Route } from 'react-router-dom';
const Book = props => {
  console.log(props);
  const { match } = props;
  const { params, path, url } = match;
  // 在动态路由中使用path，url都可以但是推荐url拼接
  return (
    <div>
      {/* 导航上的地址拼接用url，这样主要是为了地址栏美观 */}
      <h1>{params.id === '1' ? '热门小说' : '新品上市'}小说</h1>
      <NavLink to={`${url}/1111`}>1111</NavLink>
      <NavLink to={`${url}/2222`}>2222</NavLink>
      {/* 如果我们想在三级路由获取父级的动态路由值，那么Router上需要用path去拼接 */}
      <Route path={`${path}/:name`} component={Son} />
    </div>
  );
};

export default Book;
